<style lang="less">
.weapp {
  display: flex;
  height: 60px;
  align-items: center;
  justify-content: center;
}

.weapp-imgs {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;

  img {
    width: 260px;
    height: 563px;
    margin: 10px 0;
  }
}
</style>
<template>
  <div>
    <Card>
      <Alert type="warning" show-icon>
        说明：全新重构设计微信小程序！后端功能持续优化
        <a href="" target="_blank">MR.Deer</a>
      </Alert>
      <div class="weapp">
        <Poptip trigger="hover" title="打开微信扫一扫">
          <div slot="content">
            <img src="https://ooo.0o0.ooo/2019/10/06/yrtuPTL9DXQUvd211.jpg" width="180px"/>
          </div>
          <Button
              type="primary"
              icon="md-qr-scanner"
              shape="circle"
              size="size"
              style="margin-right:20px;">微信扫码体验
          </Button>
        </Poptip>
      </div>
      <div class="weapp-imgs">
        <img src="https://ooo.0o0.ooo/2019/07/08/5d22e3df51b3b41948.png"/>
        <img src="https://ooo.0o0.ooo/2019/07/08/5d22e3def39a024428.png"/>
        <img src="https://ooo.0o0.ooo/2019/07/08/5d22e3df6ee8d14238.png"/>
        <img src="https://ooo.0o0.ooo/2019/07/08/5d22e3df80a8539956.png"/>
      </div>
    </Card>
  </div>
</template>

<script>
export default {
  name: "weapp",
  data() {
    return {};
  },
  methods: {
    init() {
    }
  },
  mounted() {
    this.init();
  }
};
</script>